<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ the_title }}</title>
    <link rel="stylesheet" href="/static/app.css" />
    <style>
    body {background-color:#006699 ;
        border: none;}
    h1{ text-align: center;
        margin: 8% 10% 20% 10%;
    color: #fafcff;
    font-family: 印品雅宋简 中黑（非商用）;
        border: none;
    }
    .button {
      display: inline-block;
      border-radius: 4px;
      background-color: #99CCFF;
      border: none;
      color: #FFFFFF;
      text-align: center;
      font-size: 28px;
      padding: 20px;
      width: 200px;
      transition: all 0.5s;
      cursor: pointer;
      margin: 5px;
    }

    .button span {
      cursor: pointer;
      display: inline-block;
      position: relative;
      transition: 0.5s;
    }

    .button span:after {
      content: '»';
      position: absolute;
      opacity: 0;
      top: 0;
      right: -20px;
      transition: 0.5s;
    }

    .button:hover span {
      padding-right: 25px;
    }

    .button:hover span:after {
      opacity: 1;
      right: 0;
    }
    </style>
</head>

{#template#}

<body>
<h1>{{ the_title }}</h1>
<div>

<div class="icon sun-shower">
  <div class="cloud"></div>
  <div class="sun">
    <div class="rays"></div>
  </div>
  <div class="rain"></div>
</div>

<div class="icon thunder-storm">
  <div class="cloud"></div>
  <div class="lightning">
    <div class="bolt"></div>
    <div class="bolt"></div>
  </div>
</div>

<div class="icon cloudy">
  <div class="cloud"></div>
  <div class="cloud"></div>
</div>

<div class="icon flurries">
  <div class="cloud"></div>
  <div class="snow">
    <div class="flake"></div>
    <div class="flake"></div>
  </div>
</div>

<div class="icon sunny">
  <div class="sun">
    <div class="rays"></div>
  </div>
</div>

<div class="icon rainy">
  <div class="cloud"></div>
  <div class="rain"></div>
</div>

{#add#}

<form method="get" action="/search">
    <button class="button" style="vertical-align:middle"><span>我要查询</span></button>
</form>

</div>
</body>
</html>